@import '~styles/config.scss';

.main {
    display: flex;
    flex-wrap: wrap;
    padding-left:20px;
    padding-top:20px;
    .li{
        padding-right:20px;
        padding-bottom:20px;
        box-sizing: border-box;
        &.li1{
            width:33.33333%;
        }
        &.li2{
            width:66.66666%;
        }
        .box{
            transition   : all .5s;
            cursor: pointer;
            padding:30px 0px;
            background: $--background-color-base;
            border:1px solid $--border-color-base;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            &:hover{
                // color:#fff;
                // border-color:$--color-primary;
                // background:$--color-primary;
                border-color:$--color-primary;
                color:$--color-primary;
                background:$--background-color-primary-light;
            }
            .icon{
                font-size: 60px;
            }
            .text{
                padding-top:20px;
                text-align: center;
                line-height:30px;
                .t1{
                    font-size: 20px;
                }
                .t2{
                    font-size: 12px;
                    opacity: .6;
                }
            }
        }
    }
}